<template>
  <div class="costomTable">
    <el-table
      ref="multipleTable"
      :data="tableData"
      style="width: 100%"
      @selection-change="handleSelectionChange"
    >
      <el-table-column v-if="sort" type="selection" width="55"></el-table-column>
      <el-table-column
        :property="ele.property"
        :label="ele.label"
        v-for="(ele, i) in nameData"
        :key="i"
      />
      <el-table-column label="操作" :width="operatWidth" v-if="operating && operating.length>0">
        <template slot-scope="scope">
          <!-- @click.native.prevent="edit(scope.$index,list)" -->
          <el-button v-for="(ele,i) in operating" :key="i" type="text" size="small"
            @click="ele.fun(scope.$index)"
          >{{ele.name}}</el-button>
        </template>
      </el-table-column>
    </el-table>
    <div class="pagination" v-if="pagination">
      <el-pagination background @current-change="currentChange" layout="prev, pager, next" :total="pagination"></el-pagination>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      
    };
  },
  methods: {
    handleSelectionChange(val) {
      // console.log(val);
    },
  },
  props: {
    tableData: Array,
    nameData: Array,
    sort: Boolean,
    operating: Array,
    operatWidth: String,
    // pagination:Boolean,
    pagination:Number,
    currentChange:Function
  },
};
</script>

<style lang='scss' scoped>
.costomTable {
  .pagination{
    display: flex;
    padding: .1rem 0;
    background: #fff;
  }
  table {
    font-size: 0.12rem;
  }
}
</style>